<script setup lang="ts">
import type { KeepAlive } from 'vue';
import { useKeepAlive } from '@lingshu/integration-vue3';
import { ref } from 'vue';
import { getElementPlusLocales } from '@/locales/ElementPlusCisdi';

const keepAliveRef = ref<InstanceType<typeof KeepAlive> | undefined | null>();
const { getKeepAliveKey } = useKeepAlive(keepAliveRef);

const locales = getElementPlusLocales();
</script>

<template>
  <ElConfigProvider :locale="locales">
    <RouterView v-slot="{ Component }">
      <KeepAlive ref="keepAliveRef">
        <component :is="Component" :key="getKeepAliveKey(Component).value" />
      </KeepAlive>
    </RouterView>
  </ElConfigProvider>
</template>
